<!DOCTYPE html>
<html lang="en">
   <head>
        <meta charset="utf-8">
        <link rel="stylesheet" type="text/css" href="../css/reset.css" />
        <link rel="stylesheet" type="text/css" href="../css/style.css" />
        <link rel="stylesheet" type="text/css" href="../css/header.css" />
        <script type="text/javascript" src="../js/flexible.debug.js"></script>
        <script type="text/javascript" src="../js/flexible_css.debug.js"></script>
        <link rel="stylesheet" type="text/css" href="../css/newAddress.css" />

    </head>
   <body>
        <header class="header">
            <span class="span"><img src="../img/fanhui.png" class="return"/></span>
            <span class="span">编辑收货地址</span>
            <span class="span"><p class="btn">完成</p></span>
        </header>


        <main class="main">
            <section class="section">
                <form  class="form_input">
                    收件人：<br />
                    <input type="text"  class="shoujian"　/><br />

                     手机号:<br />
                    <input type="tel" class="tel" /><br />


                  

                    详细地址:<br />
                    <input type="textarea"  class="address"/><br />
                </form>
            </section>
        </main>


        <script type="text/javascript" src="../js/jquery-2.1.4.min.js"></script>
        <script type="text/javascript">
            $(function(){
                
               //声明一个函数 方便后面的调用   key2 和 name  是把name里面的值保存到hey2里面
            function set(key2,name){
            	//设置储存的数据
            	localStorage.setItem(key2,name);
            }
            //获取存储的数据    那么就是上面key2的名字
            function get(name){
            	return localStorage.getItem(name);
            }
            
            //当btn点击的时候  获取三个input里面的值
            $(".btn").click(function(){
            	var shoujian =	$('.shoujian').val();
				var tel = $('.tel').val();
				var address = $('.address').val();
				
				//给tel的input添加正则验证    如果不符合正则就弹框
               //if( !/^1\d{10}$/.test(tel) ) return alert("请输入正确的手机号");

                
                //如果收件人名称为空   弹出警告框
               if(shoujian === '')return alert("收件人不能为空");
				//如果地址为空  弹出警告框
               if(address === '')return alert("地址不能为空");
               	
               
               	
               
				//把input里面的值存到一个对象里面
			     var obj = {	
			     	   "sj":shoujian,
			     	   "call":tel,
			     	   "address":address 	
			     }
			     //get("infos")是getItem(name)的实参
				var infos = get("infos");
				//条件判断  如果数组里面没有存数据就执行else里面的代码  如果有数字就执行if里面的代码
				 if(infos){
				 			//把infos里面的对象转换成数组对象
                            infos = JSON.parse(infos);
                          // 把这个数组对象添加到本地
                            infos.push(obj);
                            //设置infos里面的对象   把infos转换成json对象
                         set("infos", JSON.stringify( infos ) );
                               // 存完重新设置
                        }else{
                             // 第一次存的是数组
                            set("infos", JSON.stringify( [obj] ) );
                        }
				

				 	 //值储存完毕之后就跳转页面
                    location.href="../html/adimisterAddress.html";
                    //页面跳转之后就把input里面的值强制性设置成空
                    $('.shoujian') == $('.shoujian').val("");
	                $('.tel') == $('.tel').val("");
	                $('.address') == $('.address').val("");

            })
           
         });
         
         
         
         
		$('.return').click(function(){
			location.href = 'adimisterAddress.html'
		})

        </script>

        
        
    </body>
</html>